<template>
  <a-modal
    title="地图"
    :width="1200"
    :visible="visible"
    :confirmLoading="confirmLoading"
    style="top:20px;"
    @cancel="handleCancel"
  >
    <template slot="footer">
      <a-button @click="handleCancel">关闭</a-button>
    </template>
    <div id="allMap">
        <baidu-map class="map" :center="center" :zoom="15" :ak="ak">
          <bm-marker :position="markerPo" :dragging="false" >
          </bm-marker>
        </baidu-map>
    </div>

  </a-modal>
</template>

<script>

import BaiduMap from "vue-baidu-map/components/map/Map.vue";
import BmMarker from "vue-baidu-map/components/overlays/Marker"; //点标注

  export default {
    name: "BaiduMapModal",
    components: {
      BaiduMap,
      BmMarker,
    },
    data () {
      return {
        storeName: "",
        center: {
          //经纬度
          lat: 39.63658372414733,
          lng: 118.18645947203979
        },
        zoom: 15, //地图展示级别
        location: "唐山市",
        keyword: "唐山市",
        markerPo: {
          lat: 39.63658372414733,
          lng: 118.18645947203979
        },
        isShowPanel: true,
        isShowInfo: false,
        markerIcon: "", //标注图片
        address: "",

        ak: 'GmIUtNbVkYvbT9GEMHrw665ImkHGBpC2',
        visible: false,
        confirmLoading: false,
        confirmDirty: false,
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },

      }
    },
    mounted() {

    },
    updated() {

    },
    created () {

    },

    methods: {

      showPanel() {
        //点击标注出现弹框
        this.isShowPanel = !this.isShowPanel;
      },
      infoWindowClose() {
        //弹框关闭
        this.isShowInfo = false;
      },
      infoWindowOpen() {
        //弹框打开
        this.isShowInfo = true;
      },

      show (record) {
        this.center = record.center;
        this.markerPo = record.center;
        this.keyword = record.keyword;
        this.location = record.location;
        this.visible = true;
      },
      close () {
        this.$emit('close');
        this.visible = false;
        this.disableSubmit = false;
      },

      handleCancel () {
        this.close()
      },

    }
  }
</script>